<template>
  <div class="StringPropertyItem">
    <span class="label">{{ label }}</span>
    <span class="input-group">
      <el-input @keydown.native.stop
        size="mini"
        :type="type"
        v-model="object[prop]"
        spellcheck="false"
      ></el-input>
    </span>
  </div>
</template>
<script lang="ts">
import { Component, Vue, Prop } from 'vue-property-decorator'
import { Input } from 'element-ui'

@Component({
  components: {
    [Input.name]: Input
  }
})
export default class StringPropertyItem extends Vue {
  @Prop({ type: String })
  private label!: string;

  @Prop({ type: Object, required: true })
  private object!: object;

  @Prop({ type: [String, Number], required: false })
  private prop!: string | number;

  @Prop({ type: String, required: true })
  private type!: string;
}
</script>
